<template>
 <tbody class="tbody">
   <tr v-for="(item) in tableList"
      :key="item.id"
   >
     <!--<th>{{item.order_class}}</th>
     <th>{{item.order_text}}</th>
     <th>{{item.time_stamp}}</th>-->
     <th>{{item.start_time}}</th>
     <th>{{item.stop_time}}</th>
     <th>{{item.order_text}}</th>
     <th>{{item.freq_id}}</th>
     <th>{{item.freq_name}}</th>
   </tr>
 </tbody>
</template>

<script>
import axios from 'axios'
import urls from '../../common.js'
export default {
  name: 'Cost-Query',
  data () {
    return {
      tableList: []
    }
  },
  methods: {
    orderList () {
      axios.get(urls.ordersList + '/' + this.$store.state.personinfo.pa_id + '/' + this.$store.state.personinfo.in_time + '/1')
        .then((res) => {
          if (res.data.code === '200') {
            this.tableList = res.data.data.list
          }
        })
    }
  },
  mounted () {
    this.orderList()
  }
}
</script>

<style lang='stylus' scoped>
  .tbody{
    display: inline-block;
    height: 7rem;
    overflow-y:scroll;
    -webkit-overflow-scrolling: touch
  }
  .tbody::-webkit-scrollbar {
    display: none; // 隐藏滚动条
  }
  .tbody tr{
      display:table;
      width:100%;
      height: .58rem;
      border-bottom: .01rem solid #e8e9ee;
      table-layout:fixed;
      color: #6c7580;
      font-size: 0.2rem;
    }
  .tbody tr th{
    font-weight: normal;
  }
  .tbody tr th:nth-child(1){
    width: 17%;
  }
  .tbody tr th:nth-child(2){
    width: 17%;
  }
  .tbody tr th:nth-child(3){
    width: 40%;
  }
  .tbody tr th:nth-child(4){
    width: 9%;
  }
  .tbody tr th:nth-child(5){
    width: 17%;
  }
  /*.tbody tr th:nth-child(2){
    width: 50%;
    text-align: left;
    padding-left: 10%;
  }*/
</style>
